<html>

<head>
  <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
  <link href="../../build/common/base.css" rel="stylesheet">

  <link rel="stylesheet" href="../../build/form/form.css">
  <link rel="stylesheet" href="../../build/form/page.css">
  <link rel="stylesheet" href="../../assets/js/common/element/index.css">
  <script type="text/javascript" src="../../build/common/base.js"></script>
  <script type="text/javascript" src="../../build/common/vueEdit.js"></script>
  <script src="../../assets/js/common/element/index.js"></script>
  <style>
    * {
      padding: 0px;
      margin: 0px;
    }

    input[type=file] {
      display: none;
    }

    ul li {
      list-style: none;
    }

    .my_table_box {
      display: flex;
      padding: 10px;
    }

    .link {
      height: 100%;
      width: 8px;
      background-color: #ccc;
    }

    .seek_box {
      padding: 20px;
    }

    .my_table thead th {
      white-space: nowrap;
    }

    .bud_upload_box {
      margin-top: 30px;
    }
  </style>
</head>

<body>
  <div id="ctrls" style="padding: 0 30px;">
    <!-- <div>
      <el-upload name="预算单" class="upload-demo" drag action="https://127.0.0.1:18084/project/upload" multiple>
        <i class="el-icon-upload"></i>
        <div class="el-upload__text">将文件拖到此处，或<em>点击上传</em></div>
        <div class="el-upload__tip" slot="tip">只能上传jpg/png文件，且不超过500kb</div>
      </el-upload>
    </div> -->
    <!-- <div>

      <el-upload :before-upload="beforeUpload" class="upload-demo" action="https://127.0.0.1:18084/project/upload"
        :on-preview="handlePreview" :on-remove="handleRemove" :before-remove="beforeRemove" multiple :limit="3"
        accept=".xls,.xlsx" :on-exceed="handleExceed" :file-list="fileList">
        <el-button size="small" type="primary">点击上传</el-button>
        <div slot="tip" class="el-upload__tip">只能上传jpg/png文件，且不超过500kb</div>
      </el-upload>
    </div> -->

    <div class="bud_upload_box">
      <el-upload action="https://127.0.0.1:18084/project/upload" name="name" :show-file-list="false"
        :on-success="handleSuccess" :before-upload="beforeUpload">
      <el-upload action="https://192.168.0.103:9000/file/upload" name="name" :show-file-list="false"
        :on-success="handleSuccess" :before-upload="beforeUpload">



        <el-button type="primary">上传文件</el-button>
        <div slot="tip" class="el-upload__tip">只能上传xls/xlsx文件，且不超过一个</div>
      </el-upload>
    </div>
    <div class="listPage o-x-s ng-scope">
      <div class="pr o-x-s my_box_one" style="margin-bottom: 100px">
        <div style="font-size: 20px;text-align: center;">材料库</div>
        <table class="my_table table table-striped table-bordered table_hover text-center mb60">
          <thead>
            <tr>
              <th>项目预算id</th>
              <th>任务编号</th>
              <th>任务名称</th>
              <th>一级目录</th>
              <th>二级目录</th>
              <th>三级目录</th>
              <th>备注</th>
              <th>数量</th>
              <th>单位</th>
              <th>人工工时(小时)</th>
              <th>人工费</th>
              <th>材料</th>
              <th>分包</th>
              <th>机具</th>
              <th>其他</th>
              <th>合计(元)</th>
              <th>合同额</th>
              <th>税额</th>
              <th>含税合计</th>
              <th>状态</th>
              <th>子项目</th>
            </tr>
          </thead>
          <tbody>

          </tbody>
        </table>
      </div>
    </div>
  </div>









  <table style="width: 100%; margin: 0 auto; margin-top: 30px;"
    class="table table-striped table-bordered table_hover text-center mb60">
    <tbody>
      <tr>
        <th>预算单名称</th>
        <td><input class="form-control" v-model="surbeyObj.BudgetName" type="text" name="" id=""></td>
      </tr>
      <tr>
        <th>预算单版本</th>
        <td><input class="form-control" v-model="surbeyObj.version" type="text" name="" id=""></td>
      </tr>
      <tr>
        <th>项目名称</th>
        <td><input class="form-control" v-model="surbeyObj.projectName" type="text" name="" id=""></td>
      </tr>
      <tr>
        <th>跟进人员名称</th>
        <td><input class="form-control" v-model="surbeyObj.userName" type="text" name="" id=""></td>
      </tr>
      <tr>
        <th>登记日期</th>
        <td><input class="form-control" v-model="surbeyObj.registerTime" type="text" name="" id=""></td>
      </tr>
      <tr>
        <th>项目编号</th>
        <td><input class="form-control" v-model="surbeyObj.code" type="text" name="" id=""></td>
      </tr>
      <tr>
        <th>项目唯一标识</th>
        <td><input class="form-control" v-model="surbeyObj.OnlyID" type="text" name="" id=""></td>
      </tr>
      <tr>
        <th>状态</th>
        <td><input class="form-control" v-model="surbeyObj.status" type="text" name="" id=""></td>
      </tr>
      <tr>
        <th>备注</th>
        <td><input class="form-control" v-model="surbeyObj.bz" type="text" name="" id=""></td>
      </tr>

    </tbody>
  </table>
  <span @click="handSub()" class="btn btn-success fa fa-send mb30 mt30">提交</span>
  <span @click="handCos()" class="btn btn-success fa fa-send mb30 mt30">取消</span>
  </div>
  </div>
</body>
<script type="text/javascript">
  var vm = new Vue({
    el: "#ctrls",
    data: function () {
      return {
        fileList: [],
        surbeyObj: {
          BudgetName: "",
          version: "",
          projectName: "",
          userName: "",
          registerTime: "",
          code: "",
          OnlyID: "",
          status: "",
          bz: ""
        }
      }
    },
    beforeCreate: function () {
    },
    mounted: function () {
      // var ztreeCreator = new ZtreeCreator('orgTree', __ctx + "/org/group/getTreeData")
      //   .setCallback({ onClick: zTreeOnLeftClick, onRightClick: zTreeOnRightClick })
      //   .initZtree({}, function (treeObj) { orgTree = treeObj });

    },
    created: function () {
      this.rwid = location.search.replace("?", "")
      var that = this
      var url = "http://127.0.0.1:18084/sys/amaterialversion/lists"
      var post = Vue.baseService.post(url);
      post.then(function (res) {
        that.veList = res
      }, function (status) {
        if (status == !0) {
          $.Toast.error('加载失败！' + status);
        }
      })
    },
    methods: {
      //成功的回调
      handleSuccess(response, file, fileList) {


      },
      beforeUpload(file) {
        console.log(file)
        var testmsg = file.name.substring(file.name.lastIndexOf('.') + 1)
        const extension = testmsg === 'xls'
        const extension2 = testmsg === 'xlsx'
        // const isLt2M = file.size / 1024 / 1024 < 10
        if (!extension && !extension2) {
          this.$message({
            message: '上传文件只能是 xls、xlsx格式!',
            type: 'warning'
          });
        }
        // console.log(file)
        // var testmsg = file.name.substring(file.name.lastIndexOf('.') + 1)
        // const extension = testmsg === 'xls'
        // const extension2 = testmsg === 'xlsx'
        // // const isLt2M = file.size / 1024 / 1024 < 10
        // if (!extension && !extension2) {
        //   this.$message({
        //     message: '上传文件只能是 xls、xlsx格式!',
        //     type: 'warning'
        //   });
        // }
        // if(!isLt2M) {
        //     this.$message({
        //         message: '上传文件大小不能超过 10MB!',
        //         type: 'warning'
        //     });
        // }
        // return extension || extension2 && isLt2M
        return extension || extension2
        // return extension || extension2
      },

      handleRemove(file, fileList) {
        console.log(file, fileList);
      },
      handlePreview(file) {
        console.log(file);
      },
      handleExceed(files, fileList) {
        this.$message.warning(`当前限制选择 3 个文件，本次选择了 ${files.length} 个文件，共选择了 ${files.length + fileList.length} 个文件`);
      },
      beforeRemove(file, fileList) {
        return this.$confirm(`确定移除 ${file.name}？`);
      }


    },

    watch: {

    }
  });
</script>

</html>